<template>
  <div id="addProduct">
    <div class="content">
      <el-form :label-position="labelPosition" label-width="80px" :model="formLabelAlign">
        <el-form-item label="商品分类" prop="region">
          <el-select v-model="region" placeholder="请选择">
            <el-option label="服装" value="clothing"></el-option>
            <el-option label="手机数码" value="phone"></el-option>
            <el-option label="家用电器" value="electric"></el-option>
            <el-option label="家具家装" value="furniture"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="商品名称">
          <el-input v-model="formLabelAlign.name"></el-input>
        </el-form-item>
        <el-form-item label="商品品牌" prop="region">
          <el-select v-model="region2" placeholder="请选择">
            <el-option label="小米" value="mi"></el-option>
            <el-option label="七匹狼" value="lang"></el-option>
            <el-option label="海澜之家" value="jia"></el-option>
            <el-option label="苹果" value="app"></el-option>
            <el-option label="三星" value="xing"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="商品库存">
          <el-input v-model="formLabelAlign.type"></el-input>
        </el-form-item>
        <el-form-item label="商品售价">
          <el-input v-model="formLabelAlign.price"></el-input>
        </el-form-item>
        <div class='frombox'>
          <el-form-item label="上架：" prop="delivery" class='bb'>
            <el-switch v-model="delivery"></el-switch>
          </el-form-item>
          <el-form-item label="新品：" prop="delivery" class='bb'>
            <el-switch v-model="delivery2"></el-switch>
          </el-form-item>
          <el-form-item label="推荐：" prop="delivery" class='bb'>
            <el-switch v-model="delivery1"></el-switch>
          </el-form-item>
        </div>
      </el-form>
      <el-button type="primary" class='buttonbox' @click='add'>一键下单</el-button>
    </div>
  </div>
</template>

<script>
import axios from 'axios'
export default {
  data() {
      return {
        labelPosition: 'right',
        formLabelAlign: {
          name: '',
          region: '',
          type: '',
          price:''
        },
        region: '',
        region2:'',
        delivery:true,
        delivery1:false,
        delivery2:false,
    }
  },
  methods:{
     add(){
      axios.post('http://49.233.65.169:3000/api/addgoods',{
        goodstype:this.region,
        name:this.formLabelAlign.name,
        price:this.formLabelAlign.price,
        newpro:this.delivery,
        recommend:this.delivery1,
        showout:this.delivery2,
        numbers:this.formLabelAlign.type
      }).then((data) =>[
        console.log(data)
      ])
      console.log(1)
    }
  }
}
</script>

<style scoped lang='less'>
#addProduct{
  width: 800px;
  position: absolute;
  left: 0;
  right: 0;
  padding: 35px 35px 15px 35px;
  margin: 20px auto;
  border:1px solid #DCDFE6;
    .content{
      padding: 20px;
      .boxcontent{
        padding: 20px;
      }
      .frombox{
        display:flex;
        .bb{
          flex:1;
        }
      } 
      .buttonbox{
        width:120px;
        margin-left:250px;
      }
    }
}

</style>